import {ref, onMounted, onUnmounted} from 'vue';

export default function useMousePosition() {
  const x = ref(0), y = ref(0);

  function updateMouse(event) {
    x.value = event.pageX;
    y.value = event.pageY
  }

  onMounted( () => {
    window.addEventListener('mousemove', updateMouse)
  });

  onUnmounted( () => {
    console.log(`onUnmounted removeEventListener updateMouse`);
    window.removeEventListener('mousemove', updateMouse)
  })

  return {
    x,
    y
  }
}